<%@ page isELIgnored="false" %>
<%@page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<% 
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html lang="ch">
    <head>
    	<base href="<%=basePath %>">
		<title>MINISHOP-“快”到家，才“购”味</title>
        <link href="views/front/bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<link href="views/front/css/font-awesome.min.css" rel="stylesheet">
		<link href="views/front/css/style.css" rel="stylesheet">
		<link href="views/front/css/responsive.css" rel="stylesheet">
		<link href="views/front/css/custom.css" rel="stylesheet">
    </head>
	<body>
        
        <!-- 注册弹窗-->
        <iframe id="registerDIV" class="pushDiv" scrolling="no" src="views/front/register.jsp"></iframe>
        
         <!-- 登录弹窗-->
        <iframe id="loginDIV" class="pushDiv" scrolling="no" src="views/front/login.jsp"></iframe>
        
		<!-- header -->
		<header class="header">
			<!-- header top -->
			<div class="header-top">
				<div class="container">
					<div class="row">
						<div class="col-sm-3">
							<ul class="list-inline">
								<li>
									<div class="dropdown">
										<a class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img  src="views/front/images/chinese.jpg" alt="" /> 中国 <i class="fa fa-angle-down"></i></a>
										<ul class="dropdown-menu">
											<li><a href="javascript:void(0)">中国</a></li>
										</ul>
									</div>
								</li>
								<li>
									<div class="dropdown">
									</div>
								</li>
							</ul>
						</div>
						<div class="col-sm-4">
						</div>
						<c:choose>
							<c:when test="${userInfo eq null}">
								<div class="col-sm-5" id="user_head">
                                    <ul class="list-inline pull-right">Hi,尊敬的用户，您可以
                                        <li><a href="javascript:open_div('loginDIV')" ><i class="fa fa-user"></i> 登录</a></li>
                                        <li><a href="javascript:toShopCar()" ><i class="fa fa-heart-o"></i> 购物车 (${shopCarCount })</a></li>
                                        <li><a class="register" href="javascript:open_div('registerDIV')" >注册</a></li>
                                    </ul>	
                                </div>
							</c:when>
							<c:otherwise>
								<div class="col-sm-5" id="user_head">
                                    <ul class="list-inline pull-right">Hi,
                                        <li><a href="javascript:toUserInfo()" ><i class="fa fa-user"></i> ${userInfo.uname }</a></li>
                                        <li><a href="javascript:toShopCar()" ><i class="fa fa-heart-o"></i> 购物车 (${shopCarCount })</a></li>
                                        <li><a class="exit" href="javascript:exit()" >登出</a></li>
                                    </ul>	
                                </div>
							</c:otherwise>
						</c:choose>	
				</div>
			</div>
			
			<!-- logo and adds -->
			<div class="logo-add">
				<div class="container">
					<div class="row">
						<div class="col-sm-4">
							<div class="logo"><i class="fa fa-diamond"></i>MINISHOP觅你</div>
						</div>
						<div class="col-sm-8">
							<h3 class="add bb-year-end-ribbon hidden-xs"><img src="views/front/images/red-tablet.png" width="40px;" alt="" /> 
							<span>Hi!你想要的 <span>商品</span> 都在这里</span> <button class="btn btn-default" onClick="javascript:open_div('registerDIV')"> 新用户注册 </button></h3>
						</div>
					</div>
				</div>
			</div>
			
			<!-- header bottom -->
			<div class="header-bottom">
				<div class="row">
					<div class="col-sm-12">
						<nav class="navbar navbar-default">
							<div class="container">
								<!-- Brand and toggle get grouped for better mobile display -->
								<div class="navbar-header">
									<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#header-bottom" aria-expanded="false">
										<span class="sr-only">Toggle navigation</span>
										<span class="icon-bar"></span>
										<span class="icon-bar"></span>
										<span class="icon-bar"></span>
									</button>
								</div>

								<!-- Collect the nav links, forms, and other content for toggling -->
								<div class="collapse navbar-collapse" id="header-bottom">
									<ul class="nav navbar-nav">
										<li class="active"><a href="javascript:void(0)" onClick="javascript:location.href='index.jsp'" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">首页</a></span>
										<li><a href="javascript:void(0)" onClick="javascript:location.href='views/front/product.jsp'" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">购物</a><span class="label label-danger text-center hidden-xs">New <i class="fa fa-caret-right"></i></span></li>
										<li><a href="javascript:void(0)" onClick="javascript:location.href='views/front/about-us.jsp'">关于MINISHOP</a> </li>
										<li><a href="javascript:void(0)" onClick="javascript:location.href='views/front/contact-us.jsp'">联系我们</a></li>
									</ul>
								</div>
							</div>
						</nav>
					</div>	
				</div>	
			</div>	
		</header>	
		
		<!-- home -->
		<section class="home">
			<div class="intro">
				<div id="home" class="carousel slide" data-ride="carousel">
					<ol class="carousel-indicators">
						<li data-target="#home" data-slide-to="0" class="active"></li>
						<li data-target="#home" data-slide-to="1"></li>
						<li data-target="#home" data-slide-to="2"></li>
					</ol>
					<div class="carousel-inner" role="listbox">
						<div class="item active">
							<div class="container">
								<div class="row">
									<div class="col-sm-7">
										<div class="intro-content">
											<h1>周年庆活动进行中...</h1>
											<h2>服装类最低5折起</br> <span class="highlight">买买买</span></h2>
											<p>为您提供促销特卖,新品折扣正品商品的报价、促销、评论、导购、图片等信息</p>
											<a class="btn btn-default">立即参与</a>
										</div>
									</div>
									<div class="col-sm-5">
										<img class="img-responsive" src="views/front/images/person.png" height="742" alt="" />
									</div>	
								</div>	
							</div>	
						</div>
						<div class="item">
							<div class="container">
								<div class="row">
									<div class="col-sm-7">
										<div class="intro-content">
											<h1>5.1劳动节，买一赠一</h1>
											<h2>给辛苦的自己 </br><span class="highlight">穿件好的</span></h2>
											<p>潮流新品，“冰点”享受，献给自己</p>
											<a class="btn btn-default">立即参与</a>
										</div>
									</div>
									<div class="col-sm-5">
										<img class="img-responsive" src="views/front/images/labor.jpg" alt="" />
									</div>	
								</div>	
							</div>	
						</div>
					<!-- Controls -->
					<a class="left carousel-control" href="#home" role="button" data-slide="prev"><i class="fa fa-angle-left"></i></a>
					<a class="right carousel-control" href="#home" role="button" data-slide="next"><i class="fa fa-angle-right"></i></a>
				</div>
			</div>
		</section>	
		
		
		
		
		<!-- best selling -->
		<section class="best-selling">
			<div class="container">
				<div class="row">
					<div class="col-sm-12">
						<h1><span class="t-color-2">销量</span> TOP 
						</h1>
						<div class="heading-border b-color-2"></div>
					</div>
				</div> <!-- section title -->
				<div id="best-selling" class="carousel slide" data-ride="carousel">
					<ol class="carousel-indicators">
						<li data-target="#best-selling" data-slide-to="0" class="active"><i class="fa fa-angle-left"></i></li>
						<li data-target="#best-selling" data-slide-to="1"><i class="fa fa-angle-right"></i></li>
					</ol>
					<div class="carousel-inner" role="listbox">
						<div class="item active">
							<div class="row">
								<div class="col-sm-6">
									<div class="media">
										<div class="media-left"><img src="images/e-add-1.jpg" alt=""></div>
										<div class="media-body">
											<div class="category"> category
												<div class="pull-right">
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star-o"></i>
												</div>
											</div>
											<h3>Lorem ipsum dolor sit amet dolorem molestie</h3>
											<strong>$899.00</strong>
											<div>
												<a href="javascript:void(0)" class="btn btn-default" role="button">Add to Cart</a><span class="pull-right"><i class="fa fa-heart-o"></i> Add to Wishlist</span></div>
										</div>
									</div>
								</div>
								<div class="col-sm-6">
									<div class="media">
										<div class="media-left"><img src="images/e-add-1.jpg" alt=""></div>
										<div class="media-body">
											<div class="category"> category
												<div class="pull-right">
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star-o"></i>
												</div>
											</div>
											<h3>Lorem ipsum dolor sit amet dolorem molestie</h3>
											<strong>$899.00</strong>
											<div>
												<a href="javascript:void(0)" class="btn btn-default" role="button">Add to Cart</a><span class="pull-right"><i class="fa fa-heart-o"></i> Add to Wishlist</span></div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="item">
							<div class="row">
								<div class="col-sm-6">
									<div class="media">
										<div class="media-left"><img src="images/e-add-1.jpg" alt=""></div>
										<div class="media-body">
											<div class="category"> category
												<div class="pull-right">
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star-o"></i>
												</div>
											</div>
											<h3>Lorem ipsum dolor sit amet dolorem molestie</h3>
											<strong>$899.00</strong>
											<div>
												<a href="javascript:void(0)" class="btn btn-default" role="button">Add to Cart</a><span class="pull-right"><i class="fa fa-heart-o"></i> Add to Wishlist</span></div>
										</div>
									</div>
								</div>
								<div class="col-sm-6">
									<div class="media">
										<div class="media-left"><img src="images/e-add-1.jpg" alt=""></div>
										<div class="media-body">
											<div class="category"> category
												<div class="pull-right">
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star"></i>
													<i class="fa fa-star-o"></i>
												</div>
											</div>
											<h3>Lorem ipsum dolor sit amet dolorem molestie</h3>
											<strong>$899.00</strong>
											<div>
												<a href="javascript:void(0)" class="btn btn-default" role="button">Add to Cart</a><span class="pull-right"><i class="fa fa-heart-o"></i> Add to Wishlist</span></div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</section>	
		
		<!-- special price -->
		<!-- <section class="special-price">
			<div class="price-intro">
				<div class="container">
					<div class="row">
						<div class="col-sm-12">
							<div class="pull-left">
								<blockquote>
								<h1> iPhone 6 16Gb Gold</h1>
								<p>Cicero famously orated against his political opponent Lucius Sergius against his political. </p>		
                                </blockquote>
                            </div>
							<div class="pull-right"><a class="btn btn-default btn-lg"> Call to Action</a>
							</div> 
						</div>
					</div> section title

				</div>
			</div>
		</section>	 -->
			
		<!-- product info -->
		<section class="product-info">
			<div class="container">
				<div class="row">	
					<div class="col-sm-4">
						<h1><span class="t-color-3">新品</span> 上架</h1>
						<div class="heading-border b-color-3"></div>
						<ul class="media-list">
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
						</ul>
					</div>
					<div class="col-sm-4">
						<h1><span class="t-color-4">特价</span> 商品</h1>
						<div class="heading-border b-color-4"></div>
						<ul class="media-list">
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
						</ul>
					</div>	
					<div class="col-sm-4">
						<h1><span class="t-color-5">大家</span> 想要</h1>
						<div class="heading-border b-color-5"></div>
						<ul class="media-list">
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
							<li class="media">
								<div class="media-left text-center"><img src="views/front/images/product-1.jpg" alt="">
									<a href="javascript:void(0)"><i class="fa fa-eye"></i></a>
								</div>
								<div class="media-body">
									<h3 class="media-heading">Lorem ipsum dolor sit amet</h3>
									<div class="category">
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star"></i>
										<i class="fa fa-star-o"></i>
									</div>
									<strong>$899.99</strong>
								</div>
							</li>
						</ul>
					</div>	
				</div>
			</div>
		</section>	
		
		
		<footer>
			<div class="footer-bottom">
				<div class="container">		
					<div class="row">	
						<div class="col-sm-12 text-center">
							<p>Copyright 2015 made by <a href="javascript:void(0)">周丹</a> 设计实现</p>
						</div>
					</div>
				</div>	
			</div>
		</footer>
			
        <!-- ALL JAVASCRIPT -->         
        <script src="views/front/js/jquery.js"></script>
        <script src="views/front/bootstrap/js/bootstrap.min.js"></script>
        <script src="views/front/js/custom.js"></script>
        <script type="text/javascript">
	        $(function(){
	        	$.ajax({
	        		url:'front/commodity/select/default',
	        		type:'POST',
	        		dataType:'JSON',
	        		success:function(data){
	        			//alert("success")
	        		}
	        	});
	        });
        </script>
    </body>
</html>